<layout name="page" />
<block name="content">
	{:widget('page_header/simple',array('name'=>'写邮件'))}
	<div class="operate-panel">
		<a class="btn" id="send_true">发送</a>
		<a class="btn" id="send_false" >存草稿</a>
	</div>
	<div class="frame">
		<form  method='post' id="form_send" name="form_send" enctype="multipart/form-data">
			<input type="hidden" id="ajax" name="ajax" value="0">
			<input type="hidden" id="to" name="to"/>
			<input type="hidden" id="cc" name="cc"/>
			<input type="hidden" id="bcc" name="bcc"/>

			
				<label class="input-label" for="recever">收件人*：</label>
				
					<div id="recever" class="input-box">
						<a class="add-on select_emp"> <i class="fa fa-user"></i> </a>
						<div class="wrap" >
							<span class="address_list"></span>
							<span class="text" >
								<input class="letter" type="text"  >
							</span>
						</div>
						<div class="search dropdown ">
							<ul class="dropdown-menu"></ul>
						</div>
					</div>
				</div>
			</div>
			
				<div class="input-label">
					<label for="carbon_copy"> 抄送：</label>
					<a id="toggle_bcc"><i id="toggle_bcc_icon" class="fa fa-chevron-down"></i></a>
				</div>
				
					<div id="carbon_copy" class="input-box">
						<div class="wrap" >
							<span class="address_list"></span>
							<span class="text" >
								<input class="letter" type="text"  >
							</span>
						</div>
						<div class="search dropdown ">
							<ul class="dropdown-menu"></ul>
						</div>
					</div>
				</div>
			</div>

			<div id="bcc_wrap" class="layui-form-item hidden">
				<label class="input-label" for="blind_carbon_copy"> 密送： </label>
				
					<div id="blind_carbon_copy" class="input-box">
						<div class="wrap" >
							<span class="address_list"></span>
							<span class="text" >
								<input class="letter" type="text"  >
							</span>
						</div>
						<div class="search dropdown ">
							<ul class="dropdown-menu"></ul>
						</div>
					</div>
				</div>
			</div>
			
				<label class="input-label" for="mail_title" > 标题*： </label>
				
					<input class="input"  type="text" name="name" id="mail_title"  check="required" info="请输入标题">
				</div>
			</div>
			
				<label class="input-label" > 附件： </label>
				
					{:widget('file_upload/add')}
				</div>
			</div>
			<div class="layui-form-item layui-form-text">
				
					<textarea id="content" name="content" class="editor textarea" style="height:300px;"></textarea>
				</div>
			</div>
		</form>
	</div>
</block>
<block name="js">
	<script type="text/javascript">
		layui.use(['global', 'editor'], function() {
			var $ = layui.jquery;

			/*单击删除已选联系人*/
			$(document).on("click", ".input-box .address_list a.del", function() {
				$(this).parent().parent().remove();
			});
			$('.select_emp').on('click', function() {
				winopen("{:url('popup/contact')}", 560, 470);
			});
			$("#send_true").on('click', function() {
				send(true);
			});

			$("#send_false").on('click', function() {
				send(false);
			});

			/* 查找联系人input 功能*/
			$(document).on("click", ".input-box .search li", function() {
				name = $(this).text().replace(/<.*>/, '');
				email = $(this).find("a").attr("title");
				html = conv_inputbox_item(name, email);

				inputbox = $(this).parents(".input-box");
				inputbox.find("span.address_list").append(html);
				inputbox.find("input.letter").val("");
				inputbox.find(".search ul").html("");
				inputbox.find(".search ul").hide();
				inputbox.find(".search").hide();
			});

			$(".input-box .letter").blur(function(e) {
				email = $(this).val();
				if (validate(email, 'email')) {
					name = email;
					html = conv_inputbox_item(name, email);
					$(this).parents(".input-box").find("span.address_list").append(html);
					$(this).val("");
				} else {
					$(this).val("");
					//ui_error("邮件格式错误");
					return false;
				}
			});
			/* 查找联系人input 功能*/
			$(".input-box .letter").keyup(function(e) {
				switch(e.keyCode) {
				case 40:
					var $curr = $(this).parents(".input-box").find(".search li.active").next();
					if ($curr.html() != null) {
						$(this).parents(".input-box").find(".search li").removeClass("active");
						$curr.addClass("active");
					}
					break;
				case 38:
					var $curr = $(this).parents(".input-box").find(".search li.active").prev();
					if ($curr.html() != null) {
						$(this).parents(".inpu-tbox").find(".search li").removeClass("active");
						$curr.addClass("active");
					}
					break;
				case 13:
					if ($(this).parents(".input-box").find(".search ul").html() != "") {
						name = $(".search li.active").text().replace(/<.*>/, '');
						email = $(".search li.active a").attr("title");
						html = conv_inputbox_item(name, email);
						$(this).parents(".input-box").find("span.address_list").append(html);
						$(this).parents(".input-box").find(".search ul").html("");
						$(this).val("");
						$(this).parents(".input-box").find(".search ul").hide();
					} else {
						email = $(this).val();
						if (validate(email, 'email')) {
							name = email;
							html = conv_inputbox_item(name, email);
							$(this).parents(".input-box").find("span.address_list").append(html);
							$(this).val("");
						} else {
							layer.msg("邮件格式错误");
							return false;
						}
					}
					break;
				default:
					var search = $(this).parents(".input-box").find("div.search ul");
					if ($(this).val().length > 1) {
						$.getJSON("{:url('popup/json','type=all')}", {
							key : $(this).val()
						}, function(json) {
							if (json != "") {
								if (json.length > 0) {
									search.html("");
									$.each(json, function(i) {
										search.append('<li><a title="' + json[i].email + '">' + json[i].name + '&lt;' + json[i].email + '&gt;</a></li>');
									});
									search.children("li:first").addClass("active");
									search.show();
								}
							} else {
								search.html("");
								search.hide();
							}
						});
					} else {
						search.hide();
					}
				}
			});

			function send(flag) {
				$("#to").val("");
				$("#recever .address_list span").each(function() {
					$("#to").val($("#to").val() + $(this).find("b").text() + '|' + $(this).attr("data") + '|' + $(this).attr("id") + ";");
				});

				$("#cc").val("");
				$("#carbon_copy .address_list span").each(function() {
					$("#cc").val($("#cc").val() + $(this).find("b").text() + '|' + $(this).attr("data") + '|' + $(this).attr("id") + ";");
				});

				$("#bcc").val("");
				$("#blind_carbon_copy .address_list span").each(function() {
					$("#bcc").val($("#bcc").val() + $(this).find("b").text() + '|' + $(this).attr("data") + '|' + $(this).attr("id") + ";");
				});

				if (($("#to").val().indexOf("@") < 1) && ($("#to").val().indexOf("dept_") < 1)) {
					layer.msg("请选择收件人");
					$("#recever .letter").focus();
					return false;
				}
				if (flag) {
					send_form("form_send", "{:url('send')}");
				} else {
					send_form("form_send", "{:url('save_darft')}");
				}
			}


			$('#toggle_bcc').on('click', function() {
				if ($("#bcc_wrap").attr("class").indexOf("hidden") < 0) {
					$("#bcc_wrap").addClass("hidden");
					$("#toggle_bcc_icon").addClass("fa-chevron-down");
					$("#toggle_bcc_icon").removeClass("fa-chevron-up");
				} else {
					$("#bcc_wrap").removeClass("hidden");
					$("#toggle_bcc_icon").addClass("fa-chevron-up");
					$("#toggle_bcc_icon").removeClass("fa-chevron-down");
				}
			});
		});

	</script>
</block>